import { defineConfig, loadEnv } from 'vite';
import vue from '@vitejs/plugin-vue';
// import vueJsx from '@vitejs/plugin-vue-jsx';
import checker from 'vite-plugin-checker';
import vueDevTools from 'vite-plugin-vue-devtools';
import AutoImport from 'unplugin-auto-import/vite';
import Components from 'unplugin-vue-components/vite';
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers';
// import { viteMockServe } from 'vite-plugin-mock';
import legacy from '@vitejs/plugin-legacy';
import autoprefixer from 'autoprefixer';
import postcssPluginPx2rem from 'postcss-plugin-px2rem';
import path from 'path';

// https://vite.dev/config/
export default defineConfig(({ mode, command }) => {
  // 获取当前工作目录
  // const root = process.cwd();
  const env = loadEnv(mode, process.cwd());
  const isProd = env.VITE_APP_ENV === 'production';
  return {
    esbuild: {
      drop: isProd ? ['console', 'debugger'] : [], // 移除 console 和 debugger
    },
    base: './', // 设置静态资源的基础路径
    build: {
      assetsDir: 'assets',
      chunkSizeWarningLimit: 1000, //chunk 大小警告阈值（KB）
      minify: 'terser', // 启用terser代码压缩
      sourcemap: isProd ? false : 'inline', // 生产环境禁用，开发环境内联
      reportCompressedSize: false, // 禁用压缩大小报告以提高构建速度
      rollupOptions: {
        output: {
          assetFileNames: 'assets/[ext]/[name]-[hash][extname]',
          entryFileNames: 'assets/js/[name]-[hash].js',
          chunkFileNames: 'assets/js/[name]-[hash].js',
          // 实现手动分包
          manualChunks(id) {
            if (/(vconsole)/.test(id)) return 'tool';
            if (id.includes('node_modules')) {
              if (id.includes('vant')) return 'vant';
              if (id.includes('element-plus')) return 'element-plus';
              if (id.includes('vue')) return 'vue';
              if (id.includes('lodash')) return 'lodash';
              return 'vendor';
            }
          },
        },
      },
      // target: 'es5', // 强制构建目标为ES5
      // cssTarget: 'chrome49', // 针对老旧浏览器设置CSS目标
    },
    plugins: [
      vue(),
      // vueJsx(),
      vueDevTools(),
      AutoImport({
        resolvers: [ElementPlusResolver()],
        imports: ['vue', 'vue-router'],
        dts: 'src/types/auto-imports.d.ts',
      }),
      Components({
        resolvers: [ElementPlusResolver()],
        dts: 'src/types/components.d.ts',
      }),
      // 开启mock服务器
      // viteMockServe({
      //   // 如果接口为 /mock/xxx 以 mock 开头就会被拦截响应配置的内容
      //   mockPath: 'mock', // 数据模拟需要拦截的请求起始 URL
      //   // enable: true // 本地环境是否开启 mock 功能
      //   enable: command === 'serve'  && env.VITE_APP_DEV_USE_MOCK === 'true', // 只在开发环境启用 mock
      //   logger: true, // 是否在控制台输出 mock 日志
      // }),
      //多种静态代码检查工具，以提高开发效率并确保代码质量
      checker({
        typescript: true, // 启用 TypeScript 检查
        vueTsc: true, // 启用 Vue 类型检查（适用于 Vue 项目）
        eslint: {
          useFlatConfig: true,
          lintCommand: 'eslint "./src/**/*.{ts,mts,tsx,vue,js,jsx}"',
        },
        overlay: {
          initialIsOpen: false,
        },
        terminal: true,
      }),
      //兼容旧浏览器，移动端项目重点推荐！！！
      legacy({
        targets: ['defaults', 'not IE 11'],
        modernPolyfills: true, //启用现代浏览器 polyfills
        renderLegacyChunks: false, // 禁用旧版本代码块生成
      }),
    ],
    // 路径别名
    resolve: {
      // alias: {
      //   '@': fileURLToPath(new URL('./src', import.meta.url)),
      // },
      alias: {
        '~': path.resolve(__dirname, './'),
        '@': path.resolve(__dirname, 'src'),
        SuperMap3D: '/Build/SuperMap3D/SuperMap3D.js',
      },
      extensions: ['.mjs', '.js', '.ts', '.jsx', '.tsx', '.json', '.vue'],
    },
    define: {
      CESIUM_BASE_URL: JSON.stringify('/Build/SuperMap3D/'), // Cesium 静态资源路径
    },
    css: {
      postcss: {
        plugins: [
          // 自动使用browserslist配置
          autoprefixer,
          postcssPluginPx2rem({
            // 1rem = 75px   换算基数，1rem 相当于多少 px
            rootValue: 256, // 根字体大小，默认 100px   如果分辨率是 2560*1600 使用256
            unitPrecision: 5, // 允许 REM 单位增长到的十进制数字
            propWhiteList: [], // 白名单，指定哪些属性不转换为 rem
            propBlackList: [], // 黑名单，指定哪些属性需要转换为 rem
            exclude: /(node_module)/, // 排除的文件夹或文件
            selectorBlackList: ['.ignore', /^.el-/], // 忽略 ElementPlus、自己手动设置的类
            mediaQuery: false, // 允许在媒体查询中转换 px
            minPixelValue: 1, // 设置要替换的最小像素值
          }),
        ],
      },
    },
    server: {
      host: '0.0.0.0',
      port: Number(env.VITE_APP_PORT),
      open: true,
      // 是否开启CORS跨域
      cors: true,
      proxy: {
        [env.VITE_APP_BASE_API]: {
          target: 'http://localhost:8080',
          changeOrigin: true,
          ws: true,
          rewrite: (path) => path.replace(new RegExp('^' + env.VITE_APP_BASE_API), ''),
        },
        // [env.VITE_APP_MOCK_API]: {
        //   target: 'http://localhost:5971',
        //   // 改变 Host Header
        //   changeOrigin: true,
        //   // 发起请求时将 '/api' 替换为 ''
        //   rewrite: (path) => path.replace(new RegExp('^' + env.VITE_APP_BASE_API), ''),
        // },
        '/supermap': {
          target: 'http://www.supermapol.com',
          changeOrigin: true,
          rewrite: (path) => path.replace(/^\/realspace/, '/realspace'),
        },
      },
      hmr: {
        overlay: false,
      },
    },
    optimizeDeps: {
      include: ['vue', 'element-plus'], // 预构建常用依赖
    },
  };
});
